import React from 'react';
import {
    Table,
    Row,
    Col,
    Form,
    Input,
    Icon,
    InputNumber,
    Radio,
    DatePicker,
    Select,
    Upload,
    Button,
    Switch,
    Modal,
    Popconfirm,
    Tabs,
    message,
    Tooltip
} from 'antd';

const R = require('ramda');
import OperatorConstant from "../../../utils/OperatorConstant";
import BizParams from '../../../components/commons/BizParams'
import CurrencySelect from '../../../components/commons/CurrencySelect'
import IndustrySelect from '../../../components/commons/IndustrySelect'
import ManageSelect from '../../../components/commons/ManageSelect'
import Validator from '../../../utils/Validator'
import RightBox from "../../../components/commons/RightBox";
import moment from 'moment'
import RightContacts from "../../../utils/RightConstants";
import Constants from "../../../utils/Constants";

const TabPane = Tabs.TabPane;
const FormItem = Form.Item;
const RadioGroup = Radio.Group;
const Option = Select.Option;
const dateFormat = 'YYYY-MM-DD';


export default Form.create({wrappedComponentRef: true})(class EditCustomer extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            open: false,
            disabled: true,
            type: R.isNil(this.props.type) ? "" : this.props.type,
        };
    }

    handleResetFields = () => {
        setTimeout(this.props.form.resetFields, 1001);
    }


    handleAddBlacklist = (id) => {
        let values = this.props.form.getFieldsValue();
        if (R.isEmpty(values.blacklistMemo)) {
            message.error("请输入黑名单备注！");
            return;
        }

        if (values.isblacklist) {
            message.error("此用户已经在黑名单中！");
            return;
        }
        this.props.dispatch({
            type: 'blacklist/addBlacklist',
            payload: {
                cstId: id,
                memo: values.blacklistMemo,
                onSuccess: () => {
                    this.props.dispatch({type: 'customerManage/getCustomerById', payload: {id: id, isApproval: true}});
                },
                onFail: () => {
                    message.error("黑名单加入失败");
                }
            }
        })
    }

    handleUpdatePersonnel = () => {
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource;
        let values = this.props.form.getFieldsValue();
        if (!values.manager || !values.tgmanager || !values.waiter) {
            message.error("为后续工作便利，请把人员分配完整！");
            return;
        }
        this.props.dispatch({
            type: "customerManage/updateCustomerBase",
            payload: {
                id: dataSource.id,
                manager: values.manager,
                tgmanager: values.tgmanager,
                waiter: values.waiter,
                onSuccess: () => {
                    this.props.dispatch({
                        type: 'customerManage/queryCustomerManageList',
                        payload: {
                            status: '4',
                            page: Constants.DEFAULT_PAGE
                        }
                    })
                }
            }
        })
    }


    checkCustomerInfo = (dispatch, onSuccess, cstid, changeStatus) => {

        this.props.form.validateFields((errors, values) => {
            if (errors) {
                return;
            }

            let functionname = "";
            if (this.state.type == "add") {
                functionname = "createCustomer";

            } else if (this.state.type == "edit") {
                functionname = "updateCustomerBase";
            }

            let payload = {...values};
            payload.id = cstid;
            payload.industry = R.isNil(values.industry) ? null : values.industry[0];
            payload.mainproduct = R.isNil(values.industry) ? null : values.industry[1];
            payload.registerdate = values.registerdate ? values.registerdate.format(dateFormat) : "";
            payload.onSuccess = () => {
                onSuccess();
            };

            if (changeStatus == 2) {
                payload.status = changeStatus;
            }

            dispatch({
                type: 'customerManage/' + functionname,
                payload: payload
            });

        })
    };


    render() {
        const {getFieldDecorator} = this.props.form;
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource;
        let formItemLayout = {
            labelCol: {xs: {span: 24}, sm: {span: 9}},
            wrapperCol: {xs: {span: 24}, sm: {span: 10}}
        };

        const formItemLayout2 = {
            labelCol: {span: 5},
            wrapperCol: {span: 18}
        };

        let industry = [];
        R.isNil(dataSource.industry) ? "" : industry.push(dataSource.industry);
        R.isNil(dataSource.mainproduct) ? "" : industry.push(dataSource.mainproduct);

        return (
            <Form>
                <Tabs tabPosition={'top'}>
                    <TabPane tab="企业信息" key="1">
                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="商品供应商（英文）"
                                    hasFeedback
                                >
                                    {getFieldDecorator('companynameen', {
                                        rules: [{
                                            required: true, message: '请填写商品供应商(英文)！',
                                        }],
                                        initialValue: dataSource.companynameen
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="200" autosize={true}/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="商品供应商(中文)"
                                    hasFeedback
                                >
                                    {getFieldDecorator('companyname', {
                                        rules: [{
                                            required: false, message: '请填写商品供应商(中文)！',
                                        }],
                                        initialValue: dataSource.companyname

                                    })(
                                        <Input disabled={this.props.disabled} maxLength="50" autosize={true}/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="供应商简称"
                                    hasFeedback
                                >
                                    {getFieldDecorator('shortname', {
                                        rules: [{
                                            required: false, message: '请填写供应商简称！',
                                        }],
                                        initialValue: dataSource.shortname
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="30"/>
                                    )}
                                </FormItem>
                            </Col>

                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="国家"
                                    hasFeedback
                                >
                                    {getFieldDecorator('country', {
                                        rules: [{
                                            required: true,
                                            message: '请选择国家！',
                                        }],
                                        initialValue: dataSource.country
                                    })(
                                        <BizParams sprCode={"country"} style={{width: '100%'}} blank={true}
                                                   disabled={this.props.disabled}/>
                                    )}

                                </FormItem>
                            </Col>

                        </Row>

                        <Row>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label={<a
                                        href={`https://www.zbtservices.com/v2/outsearch?ACJSESSIONID=${sessionStorage.ACJSESSIONID}`}
                                        target="_blank"><Tooltip title="点击查询信用">是否查询企业信用<Icon
                                        type="question-circle-o" style={{marginLeft: 3}}/></Tooltip></a>}
                                    hasFeedback
                                >
                                    {getFieldDecorator('ischeckinfo', {
                                        rules: [{
                                            required: true, message: '请选择是否查询企业信用！',
                                        }],
                                        initialValue: dataSource.ischeckinfo
                                    })(
                                        <RadioGroup disabled={this.props.disabled}>
                                            <Radio value={"1"}>是</Radio>
                                            <Radio value={"2"}>否</Radio>
                                        </RadioGroup>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="供应商类型"
                                    hasFeedback
                                >
                                    {getFieldDecorator('companytype', {
                                        rules: [{
                                            required: true, message: '请选择供应商类型！'
                                        }],
                                        initialValue: dataSource.companytype
                                    })(
                                        <Select style={{width: '100%'}} disabled={this.props.disabled}>
                                            <Select.Option value="0">生产型企业</Select.Option>
                                            <Select.Option value="1">贸易公司</Select.Option>
                                        </Select>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="固定电话"
                                    hasFeedback
                                >
                                    {getFieldDecorator('telephone', {
                                        rules: [
                                            {required: true, message: '请填写固定电话！'},
                                            {pattern: Validator.phone, message: '请填写正确的固定电话'},

                                        ],
                                        initialValue: dataSource.telephone
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="20"/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="移动电话"
                                    hasFeedback
                                >
                                    {getFieldDecorator('mobile', {
                                        rules: [
                                            {required: false, message: '请填写移动电话！'},
                                            {pattern: Validator.mobile, message: '请输入正确的移动电话'},
                                        ],
                                        initialValue: dataSource.mobile
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="20"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="邮箱（E-mail）"
                                    hasFeedback
                                >
                                    {getFieldDecorator('email', {
                                        rules: [
                                            {required: true, message: '请填写邮箱！'},
                                            {type: 'email', message: '请填写正确的邮箱'},
                                        ],
                                        initialValue: dataSource.email
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="30"/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem
                                    {...formItemLayout}
                                    label="传真"
                                    hasFeedback
                                >
                                    {getFieldDecorator('tax', {
                                        rules: [
                                            {required: false, message: '请填写传真！'},
                                            {pattern: Validator.fax, message: '请填写正确的传真'},
                                        ],
                                        initialValue: dataSource.tax
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="20"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="收件地址"
                                    hasFeedback
                                >
                                    {getFieldDecorator('recaddress', {
                                        rules: [{
                                            required: true, message: '请填写收件地址！',
                                        }],
                                        initialValue: dataSource.recaddress
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="100"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="公司地址(英文)"
                                    hasFeedback
                                >
                                    {getFieldDecorator('addressen', {
                                        rules: [{
                                            required: true, message: '请填写公司地址(英文)！',
                                        }],
                                        initialValue: dataSource.addressen
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="300"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="公司地址(中文)"
                                    hasFeedback
                                >
                                    {getFieldDecorator('address', {
                                        rules: [{
                                            required: false, message: '请填写公司地址(中文)！',
                                        }],
                                        initialValue: dataSource.address
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="100"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={22}>
                                <FormItem
                                    {...formItemLayout2}
                                    label="公司网址"
                                    hasFeedback
                                >
                                    {getFieldDecorator('url', {
                                        initialValue: dataSource.url
                                    })(
                                        <Input disabled={this.props.disabled} maxLength="100"/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                    </TabPane>
                </Tabs>

                {this.state.type == "edit" ?
                    <span>
                                        <Tabs tabPosition={'top'}>
                                        <TabPane tab="工商注册信息" key="2">
                                        <Row>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="注册资本"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('capital', {
                                            rules: [{
                                                required: false, message: '请填写注册资本！',
                                            }],
                                            initialValue: dataSource.capital
                                        })(
                                            <InputNumber style={{width: 150}} disabled={this.props.disabled}
                                                         maxLength="18"/>
                                        )}
                                            （万）
                                        </FormItem>
                                        </Col>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="注册资本币种"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('capitalcurrency', {
                                            rules: [{
                                                required: false, message: '请选择注册资本币种！',
                                            }],
                                            initialValue: dataSource.capitalcurrency
                                        })(
                                            <CurrencySelect disabled={this.props.disabled}/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        </Row>
                                        <Row>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="成立日期"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('registerdate', {
                                            rules: [{
                                                required: false, message: '请填写成立日期！',
                                            }],
                                            initialValue: (R.isNil(dataSource.registerdate) || R.isEmpty(dataSource.registerdate)) ? undefined : moment(dataSource.registerdate, dateFormat)
                                        })(
                                            <DatePicker style={{width: 150}} disabled={this.props.disabled}/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="邓氏编码"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('duns', {
                                            rules: [{
                                                required: false, message: '请填写邓氏编码！',
                                            }],
                                            initialValue: dataSource.duns
                                        })(
                                            <Input disabled={this.props.disabled} maxLength="100"/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        </Row>
                                        </TabPane>
                                        </Tabs>
                                        <Tabs tabPosition={'top'}>
                                        <TabPane tab="营业信息" key="3">
                                        <Row>
                                        <Col span={22}>
                                        <FormItem
                                            {...formItemLayout2}
                                            label="主营产品  "
                                            hasFeedback
                                        >
                                        {getFieldDecorator('industry', {
                                            rules: [{
                                                required: true, message: '请填写主营产品！',
                                            }],
                                            initialValue: industry
                                        })(
                                            <IndustrySelect disabled={this.props.disabled}/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        </Row>

                                        <Row>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="主要结算方式"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('settlement', {
                                            rules: [{
                                                required: true, message: '请选择主要结算方式！'
                                            }],
                                            initialValue: dataSource.settlement
                                        })(
                                            <BizParams sprCode={"settlement"} style={{width: '100%'}}
                                                       disabled={this.props.disabled}/>
                                        )}
                                        </FormItem>
                                        </Col>


                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="主要出口国家/地区"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('exportcountry', {
                                            rules: [{
                                                required: true,
                                                message: '请选择主要出口国家/地区！',
                                            }],
                                            initialValue: dataSource.exportcountry
                                        })(
                                            <BizParams sprCode={"country"} style={{width: '100%'}} blank={true}
                                                       disabled={this.props.disabled}/>
                                        )}

                                        </FormItem>
                                        </Col>

                                        </Row>

                                        <Row>

                                                      <Col span={12}>
                                        <FormItem {...formItemLayout} label="年产值币种" hasFeedback>
                                        {getFieldDecorator('aovCurrency', {
                                            rules: [{
                                                required: true, message: '请选择币种'
                                            }],
                                            initialValue: dataSource.aovCurrency
                                        })(
                                            <CurrencySelect disabled={this.props.disabled}/>
                                        )}
                                        </FormItem>
                                        </Col>

                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="年产值(万)"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('annualOutputValue', {
                                            rules: [{
                                                required: true, message: '请填写年产值！',
                                            }],
                                            initialValue: dataSource.annualOutputValue
                                        })(
                                            <Input disabled={this.props.disabled} maxLength="18"/>
                                        )}
                                        </FormItem>
                                        </Col>


                                        </Row>

                                        <Row>
                                           <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="行业经营年限"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('industrylife', {
                                            rules: [{
                                                required: true, message: '请填写主要行业经营年限！',
                                            }],
                                            initialValue: dataSource.industrylife
                                        })(
                                            <InputNumber min={0} style={{width: 150}} disabled={this.props.disabled}
                                                         maxLength="11"/>
                                        )}
                                        </FormItem>
                                        </Col>

                                        </Row>


                                        </TabPane>
                                        </Tabs>
                                        </span>
                    : ""}

                {this.state.type == "edit" ?
                    <div>
                        <Tabs tabPosition={'top'}>
                            <TabPane tab="人员分配" key="3">
                                <Row>
                                    <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="风控经理分配"
                                            hasFeedback
                                        >
                                            {getFieldDecorator('fkmanager', {
                                                rules: [{
                                                    required: true, message: '请选择风控经理分配！',
                                                }],
                                                initialValue: dataSource.fkmanager
                                            })(
                                                <ManageSelect sprCode={"fkmanager"} style={{width: '100%'}} blank={true}
                                                              disabled={this.props.disabled}/>
                                            )}
                                        </FormItem>
                                    </Col>
                                </Row>

                                <RightBox resource={RightContacts.SUPPLIER.SUPPLIER_PERSONNEL_ASSIGNMENT}>
                                    {dataSource.status === '4' && this.props.personAllocation ?
                                        <span>
                                        <Row>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="采购经理分配"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('manager', {
                                            rules: [{
                                                required: true, message: '请选择采购经理！',
                                            }],
                                            initialValue: dataSource.manager
                                        })(
                                            <ManageSelect sprCode={"ywmanager"} style={{width: '100%'}} blank={true}
                                                          disabled={false} allowClear/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="跟单经理分配"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('waiter', {
                                            rules: [{
                                                required: true, message: '请选择跟单经理！',
                                            }],
                                            initialValue: dataSource.waiter
                                        })(
                                            <ManageSelect sprCode={"gdmanager"} style={{width: '100%'}} blank={true}
                                                          disabled={false} allowClear/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        </Row>

                                        <Row>
                                        <Col span={12}>
                                        <FormItem
                                            {...formItemLayout}
                                            label="通关经理分配"
                                            hasFeedback
                                        >
                                        {getFieldDecorator('tgmanager', {
                                            rules: [{
                                                required: true, message: '请选择通关经理！',
                                            }],
                                            initialValue: dataSource.tgmanager
                                        })(
                                            <ManageSelect sprCode={"tgmanager"} style={{width: '100%'}} blank={true}
                                                          disabled={false} allowClear/>
                                        )}
                                        </FormItem>
                                        </Col>
                                        <Col span={12}>
                                        <span style={{marginLeft: 20}}>
                                        <Button type="primary" icon="className" size={'default'}
                                                onClick={this.handleUpdatePersonnel.bind(this)}
                                                style={{marginLeft: 10}}>确认分配</Button>
                                        </span>
                                        </Col>
                                        </Row>
                                        </span>
                                        : ''}
                                </RightBox>
                            </TabPane>
                        </Tabs>

                        {/*{R.isNil(this.props.blacklist) ? "" :*/}
                        {/*<Tabs tabPosition={'top'}>*/}
                        {/*<TabPane tab="黑名单" key="4">*/}
                        {/*<Row>*/}
                        {/*<Col span={12}>*/}
                        {/*<FormItem*/}
                        {/*{...formItemLayout2}*/}
                        {/*label="黑名单备注"*/}
                        {/*hasFeedback*/}
                        {/*>*/}
                        {/*{getFieldDecorator('blacklistMemo', {*/}
                        {/*rules: [{*/}
                        {/*required: false, message: '请输入黑名单备注',*/}
                        {/*}],*/}
                        {/*initialValue: dataSource.blacklistMemo*/}
                        {/*})(*/}
                        {/*<Input.TextArea disabled={dataSource.isblacklist ? true : false}*/}
                        {/*maxLength="200" autosize={true} />*/}
                        {/*)}*/}
                        {/*</FormItem>*/}
                        {/*</Col>*/}
                        {/*{(R.isEmpty(dataSource.isblacklist) || dataSource.isblacklist) ?*/}
                        {/*"" :*/}
                        {/*<Col span={12}>*/}
                        {/*<RightBox resource={RightContacts.SUPPLIER.SUPPLIER_BLACKLIST_ADD}>*/}
                        {/*<Button type="primary" icon="add"*/}
                        {/*onClick={this.handleAddBlacklist.bind(this, dataSource.id)}>加入黑名单</Button>*/}
                        {/*</RightBox>*/}
                        {/*</Col>*/}
                        {/*}*/}
                        {/*</Row>*/}
                        {/*</TabPane>*/}
                        {/*</Tabs>*/}
                        {/*}*/}
                    </div>
                    : ""}

            </Form>
        )
    }


})


// WEBPACK FOOTER //
// ./public/src/components/supplier/components/EditCustomer.js
